<template>
  <div class="home">
    <van-button type="primary" @click="jumpMap('add')">跳转地图定位</van-button>
    <van-button class="t-margin-top-10" type="danger" @click="jumpMap('location')">全量地图定位</van-button>
    <van-cell-group class="t-margin-top-10">
      <van-field v-model="address" label="详细地址" />
      <van-field v-model="lat" label="纬度" />
      <van-field v-model="lng" label="经度" />
    </van-cell-group>
  </div>
</template>

<script>
export default {
  name: 'Home',
  components: {
  },
  data () {
    return {
      address: '', // 详细地址
      lat: null, // 纬度
      lng: null // 经度
    }
  },
  created () {
    this.getAppRouters()
  },
  mounted () {
    // 地图定位返回数据
    if (this.$route.query.locationObj) {
      console.log('地图定位返回数据', JSON.parse(this.$route.query.locationObj))
      const { addressComponent, position } = JSON.parse(this.$route.query.locationObj)
      const { province, city, district, township, street, streetNumber } = addressComponent
      const { lat, lng } = position
      this.address = province + city + district + township + street + streetNumber
      this.lat = lat// 纬度
      this.lng = lng// 经度
    }
  },
  methods: {
    jumpMap (type) {
      console.log('跳转进入地图')
      let defaultLocation
      if (type === 'location') {
        defaultLocation = JSON.stringify([
          {
            lnglat: [113.353326, 23.296151],
            title: '我测试的信息1'
          },
          {
            lnglat: [113.353300, 23.296100],
            title: '我测试的信息2'
          },
          {
            lnglat: [113.354726, 23.216151],
            title: '我测试的信息3'
          },
          {
            lnglat: [113.359126, 23.196151],
            title: '我测试的信息4'
          },
          {
            lnglat: [113.399926, 23.211151],
            title: '我测试的信息5'
          }
        ])
      }
      this.$router.push({
        path: '/testMap',
        query: {
          type,
          defaultLocation
        }
      })
    },
    // 获取用户菜单
    async getAppRouters () {
      const res = await this.$http('getAppRouters')
      console.log('获取用户菜单', res)
    }
  }
}
</script>
<style lang="scss" scopes>
.home {
  height: 100vh;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
</style>
